import './App.css';
import React, { Suspense, lazy } from 'react';
import { BrowserRouter as Router, Route, Routes, Link } from 'react-router-dom';
const Home = lazy(() => import('./pages/Home/index.js'));
const Login = lazy(() => import('./pages/Login'));
const List = lazy(() => import('./pages/List'));

function App() {
  return (
    <Router>
      <Link className='my-link' to="/">首页</Link>
      <Link className='my-link' to="/login">登录</Link>
      <Link className='my-link' to="/list">列表</Link>
      <Suspense fallback={<div>Loading...</div>}>
        <Routes>
          <Route exact path="/" element={<Home/>}/>
          <Route path="/login" element={<Login/>}/>
          <Route path="/list" element={<List/>}/>
        </Routes>
      </Suspense>
    </Router>
  );
}

export default App;
